<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<!DOCTYPE html>
<%
 String contextPath = request.getContextPath();
%>
<html>
<head>
<%-- <jsp:include page="/pages/common/header.jsp"></jsp:include> --%>

<script type="text/javascript" src="<%=contextPath %>/lib/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="<%=contextPath %>/lib/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="<%=contextPath %>/lib/respond.min.js"></script>
<script type="text/javascript" src="<%=contextPath %>/lib/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
<script type="text/javascript" src="<%=contextPath %>/lib/bootstrap-datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>
<script type="text/javascript" src="<%=contextPath %>/lib/koala-ui.plugin.js"></script>
<script type="text/javascript" src="<%=contextPath %>/lib/koala-tree.js"></script>
<script type="text/javascript" src="<%=contextPath %>/lib/validate.js"></script>
<script type="text/javascript" src="<%=contextPath %>/js/layer/layer.min.js"></script>
<%-- <script type="text/javascript" src="<%=contextPath %>/js/layer/extend/layer.ext.js"></script> --%>

<script type="text/javascript" src="<%=contextPath %>/js/ts-common.js"></script>
<link href="<%=contextPath %>/lib/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="<c:url value='/lib/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css' />" rel="stylesheet" type="text/css" />
<link href="<%=contextPath %>/css/koala.css" rel="stylesheet" type="text/css" />
<link href="<%=contextPath %>/css/main.css" rel="stylesheet" type="text/css" />



<title>渠道状态任务详情</title>

<script type="text/javascript">
	Date.prototype.format = function(format){
		 var o = {
			 "M+" : this.getMonth()+1, //month
			 "d+" : this.getDate(),    //day
			 "h+" : this.getHours(),   //hour
			 "m+" : this.getMinutes(), //minute
			 "s+" : this.getSeconds(), //second
			 "q+" : Math.floor((this.getMonth()+3)/3),  //quarter
			 "S" : this.getMilliseconds() //millisecond
		 }
		 if(/(y+)/.test(format)) format=format.replace(RegExp.$1,
		 (this.getFullYear()+"").substr(4 - RegExp.$1.length));
		 for(var k in o)
			 if(new RegExp("("+ k +")").test(format))
				 format = format.replace(RegExp.$1,
		 							RegExp.$1.length==1 ? o[k] :
		 								("00"+ o[k]).substr((""+ o[k]).length));
		 return format;
	}
	var noInfo="对不起，暂时没有相关任务执行记录，请重新查询";
	var error="对不起，查询出现异常，可能系统繁忙，请稍候重新查询";
	$(function(){
		//toggleInfo(null,$("#dataForm"));
		
		var auth=$("input[name='authSubmit']",$("#dataForm"));
		if(auth){
			submitData(0,10);
		} 
		
		$(".detail-status").click(function(){
			$("#taskStatus").val($(this).val());
			submitData(0,10);
		});
	}); 
	
	
	function submitData(pageIndex,pageLen){
		pageIndex=pageIndex?pageIndex:0;
		pageLen=pageLen?pageLen:15;
		var form=$("#dataForm");
		var url="<%=contextPath%>/task/TaskDetail/detail.koala?";
		if (!form) {
			$("#tipP").html(noInfo);
			$("#resultTable").hide();
		} else {
			var formData = $(form).serialize();
			formData += "&pageIndex=" + pageIndex;
			formData += "&pageLen=" + pageLen;
			$.post(url, formData, function(data) {
				toggleInfo(null, data);
			}).error(function() {
				toggleInfo(error, null);
			});
		}
	}

	function toggleInfo(tipInfo, data) {
		if (tipInfo) {
			$("#tipP").html(noInfo);
			$("#tipP").show();
		} else {
			$("#tipP").hide();
		}
		if (!data || !data.data || data.data.length == 0) {
			$("#resultTable").hide();
			$("#pageDiv").hide();
			$("#tipP").html(noInfo);
			$("#tipP").show();
		} else {
			bindData(data);
			bindPageInfo($("#pageUl"), data.start, data.pageCount,
					data.pageMenuMaxSize,data.resultCount);
		}

	}
	function formatDate(datetime){
		if(datetime){
			return new Date(datetime).format("yyyy-MM-dd hh:mm:ss");
		}
		return "";
	}
	function formatExecuteTimes(stime, etime){
		if(stime && etime){
			return etime - stime;
		}
		return "";
	}
	function bindData(data) {
		if (!data || !data.data || data.data.length == 0) {
			$("#tipP").html(noInfo).show();
			$("#resultTable").hide();
		} else {
			var html = "";
			for ( var i = 0; i < data.data.length; i++) {
				html += "<tr>";
				var t = data.data[i];
				html += "<td>" + (i + 1 + data.start * data.pageSize) + "</td>";
				/* html += "<td>" + t.fromCity + " (" + t.fromCityName + ") "
						+ "--" + t.toCity + " (" + t.toCityName + ") "
						+ "</td>"; */
				html += "<td>"+t.fromCity+" - "+t.toCity+"</td>";
				html += "<td>" + t.flightDate + "</td>";
				html += "<td>" + t.returnGrabDate + "</td>";
				html += "<td>"+t.priority+"</td>";
				html += "<td>"+formatDate(t.startTime)+"</td>";
				html += "<td>"+formatDate(t.endTime)+"</td>";
				html += "<td>"+formatExecuteTimes(t.startTime, t.endTime)+"</td>";
				html += "<td><a href='#' onclick=javascript:$('#remarksTr"+ i + "').toggle('fast')>查看</a>";
				html += "</tr>";
				html += "<tr></tr><tr id='remarksTr"+i+"' style='display:none'><td  colspan='8'>"
							  +getMoreInfoTemplate(t,i)+ "</td></tr>";
			}
			var table = $("#resultTable");
			$("tbody", table).html(html);
			$("tipP").hide();
			$(table).show();
		}
	}
	function getMoreInfoTemplate(data,id){
		var html="";
		if(!data){
			html="暂无详情";
		}else{
			
			html+="<table class='detailTable'>";
			//html="<div class='alert alert-info' ><p class='text-left'>任务抓取次数:</p><p>123456</p></div>";
			/* html+=getInfoP("任务id",data.id);
			html+=getInfoP("任务出发到达城市",data.fromCityName+"-"+data.toCityName);
			html+=getInfoP("任务抓取渠道",data.grabChannel);
			html+=getInfoP("任务镜像文件key",data.sourceRowkey);
			html+=getInfoP("任务抓取次数",data.grabTimes);
			html+=getInfoP("任务投放次数",data.taskCompensateCount);
			html+=getInfoP("任务抓取航班数量",data.crawlCount);
			html+=getInfoP("任务流量",data.byteLength);
			html+=getInfoP("执行线程名称",data.recordName);
			html+=getInfoP("任务使用IP",data.proxyIp);
			html+=getInfoP("任务抓取日记",data.remarks); */
			
			html+=getInfoT("任务id",data.id);
			html+=getInfoT("任务出发到达城市",data.fromCityName+"-"+data.toCityName);
			html+=getInfoT("任务抓取渠道",data.channel.name);
			html+=getSourceInfo("任务镜像文件key",data.sourceRowkey);
			html+=getInfoT("任务投放次数",data.excuteCount);
			/* html+=getInfoT("任务抓取数量",data.crawlCount); */
			html+=("<tr><th>任务抓取数量</th><td>"+(data.crawlCount==0?"<label style='color:red;'>暂无</label>":data.crawlCount)+"</td></tr>");
			
			if(data.actions){
				data.actions.sort(function(a,b){
					return a.timestamp>b.timestamp;
				});
				for(var i=0;i<data.actions.length;i++){
					var a=data.actions[i];
					html+=getInfoT2("执行时间",a.timestampStr,"执行动作",a.remark);
				}
			}
			html+="</table>";
		}
		return html;
	}
	
	function getSourceInfo(attr,value){
	 	if(value !=null)
			return "<tr><th>"+attr+"</th><td><a href=javascript:getCode('"+value+"');>"+value+"</a></td></tr>";
		else
			return "<tr><th>"+attr+"</th><td>"+value+"</td></tr>";
	}
	
	//镜像文件跳转
	function getCode(id){
		window.open("<%=contextPath%>/task/TaskDetail/sourceFile.koala?id="+id);
	}
	
	function getInfoT(attr,value){
		return "<tr><th>"+attr+"</th><td>"+value+"</td></tr>";
		//return "<tr><th>"+attr+"</th><td><a href='javascript:getCode(value);'>"+value+"</a></td></tr>";
	}
	function getInfoT2(attr1,value1,attr2,value2){
		return "<tr><th>"+attr1+"</th><td>"+value1+"</td><th>"+attr2+"</th><td>"+value2+"</td></tr>";
	}
	
	function bindPageInfo(e, pageIndex, pageCount, maxPageMenu,resultCount) {
		var html = "";
		if (!e || pageIndex < 0 || pageCount <= 0 || maxPageMenu <= 0 ||resultCount<=0) {
			$(e).hide();
			return;
		}
		var start = parseInt(pageIndex / maxPageMenu) * maxPageMenu;
		var end = ((start + maxPageMenu) > pageCount) ? pageCount - 1 : (start
				+ maxPageMenu - 1);
		if (pageIndex <= 0) {
			html += "<li class='disabled'><a href='#' pageNo='0'>&laquo;</a></li>";
		} else {
			html += "<li><a href='#' pageNo='" + (pageIndex - 1)
					+ "'>&laquo;</a></li>";
		}
		for ( var i = start; i <= end; i++) {
			html += "<li " + (pageIndex == i ? "class='active'" : "")
					+ "><a href='#' pageNo='"+i+"'>" + (i + 1) + "</a></li>";
		}
		if (pageIndex + 1 >= pageCount) {
			html += "<li class='disabled'><a href='#' pageNo='"+pageIndex+"'>&raquo;</a></li>";
		} else {
			html += "<li><a href='#' pageNo='" + (pageIndex + 1)
					+ "'>&raquo;</a></li>";
		}
		$(e).html(html);

		$("a[pageNo]", e).click(function() {
			submitData($(this).attr('pageNo'), 10);
		});
		$("#pageResultCount").html(resultCount);
		$("#pageDiv").show();
	}
</script>

<style type="text/css">
td,th {
	text-align: center;
}
.detailTable td,th{
	text-align:left;
}

</style>

</head>
<body>
	<%-- 参数通过超链接过来，然后js取得参数提交 --%>
	<form id='dataForm' action="">
		<input name="authSubmit" type="hidden" value="${param.authSubmit }" />
		<input name="channelId" type="hidden" value="${param.channelId }" />
		<input id="taskStatus" name="taskStatus" type="hidden" value="${param.taskStatus }" />
		<input name="method" type="hidden" value="${param.method }" />
		<input name="grabDateStr" type="hidden" value="${param.grabDateStr }" />
		<%-- <input name="page" id="page" type="hidden" value="${page}" /> --%>
	</form>


	<div class="panel panel-default">
		<div class="panel-heading" style="margin-top:15px;">&nbsp;<c:if test="${param.taskStatus==-2}">状态：
			<input type="radio" class="detail-status" name="status" value="-2" checked>抓取失败 &nbsp; &nbsp;
			<input type="radio" class="detail-status" name="status" value="-3">解析失败 &nbsp;&nbsp;
			<input type="radio" class="detail-status" name="status" value="-4">其它失败</c:if>
			<c:if test="${param.taskStatus==-5}">
				<input type="radio" class="detail-status" name="status" value="-5" checked>失败 &nbsp;&nbsp;
				<input type="radio" class="detail-status" name="status" value="5" >成功 &nbsp; &nbsp;
			</c:if>
		</div> 
		<div class="panel-body" id="panelBodyDiv" >
			<p id="tipP"></p>
			<table id="resultTable"
				class="table table-bordered table-hover table-striped table-condensed"
				style="display: none">
				<thead>
					<tr>
						<th>序号</th>
						<th>航段</th>
						<th>起飞时间</th>
						<th>回程时间</th>
						<th>任务优先级</th>
						<th>开始时间</th>
						<th>结束时间</th>
						<th>执行时长</th>
						<th>任务详情</th>
					</tr>
				</thead>
				<tbody></tbody>
			</table>
			<div id="pageDiv" class="form-inline padding:0px;margin:0px;"
				style="display: none;">
				<table style="padding: 0px;">
					<tr style="padding: 0px;">
						<td><ul class="pagination pagination-centered "
								style="padding: 0px; margin: 0px;" id="pageUl"></ul></td>
						<td><label>&nbsp;&nbsp;&nbsp;跳转到 </label> <select
							class="form-control" style="margin-top: -5px; margin-left: 10px;"pageSelect"></select></td>
						<td><label>&nbsp;&nbsp;&nbsp;共&nbsp; </label><label
							id="pageResultCount"></label> <label>&nbsp;条数据</label></td>
					</tr>
				</table>
			</div>
			<p id="tipP"></p>
		</div>
		<div class="text-center panel-footer" style="padding: 0px"></div>
		
	</div>

</body>
</html>